<template>
  <transition name="slide">
    <div class="list">
      <van-nav-bar title="校车时刻" leftText="返回" rightText="1" leftArrow @click-left="onClickLeft" @click-right="onClickRight" />
      <!-- <div class="scroll-wrapper" :ref="scroll-wrapper">
        <cube-scroll ref="scroll" :data="items" :options="options" @pulling-up="onPullingUp" @pulling-down="onPullingDown"></cube-scroll>
      </div> -->
      
      <div class="carContent">
        <form action="/">
          <van-search
            v-model="value"
            placeholder="请输入商品名称"
            show-action
            @search="onSearch"
            @cancel="onCancel"
          />
        </form>
        <ul>
          <li class="carList" v-for="(item,index) in carList" :key="index" @click="goCarlistDetail(index)">
            {{item[2]}}
          </li>
        </ul>
      </div>
      <router-view></router-view>
    </div>
  </transition>
</template>
<script>
import store from "../../common/store";

import Vue from 'vue';
import { Search } from 'vant';

Vue.use(Search);

export default {
  data (){
    return {
      value:'',
      toggle:true,
      carList:[]
    }
  },
  methods:{
    onClickLeft () {
      this.$router.go(-1)
    },
    onClickRight () {
      this.$router.push('/login/mint-pull')
    },
    onSearch (){},
    onCancel (){},
    goCarlistDetail (index){
      console.log(index)
      let data =  this.carList[index][5]
      console.log(data)
      this.$router.push('/index/carListDetail/carList')
      store.commit('user_carList',data);
      
    }
  },
  created (){
    this.$apis.getCarList("",store.state.accesskey).then(res =>{
      console.log(res.res)
      this.carList = res.res
      
    })
  }
}
</script>
<style lang="less">
@import  "../../assets/less/baseDetail.less";

.carList{
  font-size: 14px;
  line-height: 30px;
  border-bottom: 1px solid #eee;
  padding: 10px 0 10px 7%;
}
#carListDetail{
  width: 100%;
  height: calc(~'100% - 46px');
  overflow: scroll;
}
#carListDetail img{
  width: 100%;
}
#carListDetail p,#carListDetail li{
  line-height: 24px;
  font-size: 13px;
}
</style>

